<template>
  <div v-if="show" class="fontDa">
<!--    <div class="score">{{ cepingHdglXpxxb.cphzfz }} 分</div>-->
    <div class="customTableHeader">
      <!--      <div class="customTableTitle">{{ cepingHdglb.hdName }}</div>-->
      <div class="customTableTitle">{{ cepingHdglCppmxbInfo.cppName }}</div>

      <div class="customTableHeader">
        <div class="customTableTitle" style="display: flex;justify-content: center;"><div>可推荐人数：{{ cepingHdglCppmxbInfo.recommendNum }}</div><div style="margin-left: 110px;">已推荐人数：{{ recommendNumRead }}</div></div>
      </div>
      <!-- <div class="customTableSummary flex justifyContentSpaceBetween" style=" position:relative; margin-top:-25px;">


      </div> -->
<!--      <div class="zhaoPian">-->
<!--        <span v-if="cepingHdglXpxxb.bcpDx == '部门'">测评对象：{{ cepingHdglXpxxb.bcpDeptName + '领导班子' }}</span>-->
<!--        <span v-else>-->
<!--            <el-row>-->
<!--              <el-col :span="3">-->
<!--                <el-popover v-if="cepingCpgzBcpmxbUser.avatar" placement="right" trigger="hover">-->
<!--                  <img :src="cepingCpgzBcpmxbUser.avatar" style="height: 380px">-->
<!--                  <img slot="reference" :src="cepingCpgzBcpmxbUser.avatar" style="width: 65px;height: 90px;">-->
<!--                </el-popover>-->
<!--                <img v-else src="/img/avatar.jpg" style="width: 65px;height: 90px;display: block; border-radius:3px;"/>-->
<!--              </el-col>-->
<!--              <el-col :span="21">-->
<!--                <el-row>测评对象：{{ cepingCpgzBcpmxbUser.ryName }}</el-row>-->
<!--                &lt;!&ndash;                <el-row>{{ cepingCpgzBcpmxbUser.deptName + ' ' + cepingCpgzBcpmxbUser.ryZw }}</el-row>&ndash;&gt;-->
<!--                <el-row>{{ cepingCpgzBcpmxbUser.ryZw }}</el-row>-->
<!--              </el-col>-->
<!--            </el-row>-->
<!--          </span>-->
<!--      </div>-->
<!--      <div style="float:right;padding-bottom:10px;">-->
<!--        <el-button type="primary" icon="el-icon-document" :underline="false" style="margin-left:20px"-->
<!--                   @click="viewBg( cepingHdglXpxxb)">-->
<!--          {{ cepingHdglXpxxb.bcpDx == '部门' ? "查看班子述职报告" : "查看个人述职报告" }}-->
<!--        </el-button>-->
<!--        <el-button type="primary" icon="el-icon-collection" :underline="false" style="margin-left:20px" @click="viewGz">-->
<!--          评价标准-->
<!--        </el-button>-->
<!--      </div>-->
    </div>
    <div class="zhaoPian">
      <div style="padding-bottom: 10px;">单位：{{cepingHdglCppmxbInfo.sheetDept}}</div>
    </div>
    <div class="cpTable fontDa">
      <el-table :data="tableData" :span-method="objectSpanMethod" border height="calc(100vh - 390px)"
                :row-class-name="tableRowClassName">
        <el-table-column  type="index"  label="序号" header-align="center" align="center" width="70"></el-table-column>
        <el-table-column v-for="col in colShowAll" :prop="col.prop" :label="col.label">
        </el-table-column>
        <el-table-column v-for="(gz,j) in tableColumn" :key="j+10000"
                         :fzIndex="j" label="是否推荐" align="center" min-width="50">
          <template slot-scope="scope">
            <el-button type="text" icon="el-icon-success" :disabled="checkDisabled" class="cpCheck" v-if="scope.row.wxOpenid==gz.isTj" @click="delDaFen(scope.$index,gz)"></el-button>
            <el-button type="text" class="cpCheck" v-else :disabled="checkDisabled"  @click="cpDaFen(scope.$index,gz)"><i class="noChecked"></i>
            </el-button>
          </template>
        </el-table-column>
<!--        <el-table-column v-for="(h,i) in tableHeader" :key="i" :label="h" align="center">-->
<!--          <el-table-column v-for="(gz,j) in tableColumn" :key="j+10000" :label="gz.fzMc" v-if="gz.fzSsz==h"-->
<!--                           align="center" :fzIndex="j">-->
<!--            <template slot-scope="scope">-->
<!--              <el-button type="text" icon="el-icon-success" class="cpCheck" v-if="scope.row.fzId==gz.id"></el-button>-->
<!--              <el-button type="text" class="cpCheck" v-else @click="cpDaFen(scope.$index,gz)"><i class="noChecked"></i>-->
<!--              </el-button>-->
<!--            </template>-->
<!--          </el-table-column>-->
<!--        </el-table-column>-->
      </el-table>
    </div>
<!--    <div style="width: 100%;margin-top:30px;" class="zfheaderbox">-->
<!--      <div>{{cepingHdglCppmxbInfo.footerText}}</div>-->
<!--    </div>-->
<!--    <el-dialog title="述职报告" :visible.sync="bgdialogVisible" width="90vw" top="3vh" append-to-body>-->
<!--      <div class="fontDa">-->
<!--        <iframe :src="bgUrl" style="width: 100%;height:75vh"></iframe>-->
<!--      </div>-->
<!--      <span slot="footer" class="dialog-footer">-->
<!--        <el-button @click="bgdialogVisible = false">取消</el-button>-->
<!--      </span>-->
<!--    </el-dialog>-->
  </div>

</template>

<script>
import {daFenDj, queryBcpUserSzbg} from "@/api/ceping/cepinghdglxpxxb";
import {xpInfo,daFenCp,delDaFenCp,xpInfoSm} from "@/api/ceping/jxevalvote";
import {getPreview} from "@/util/util";

export default {
  name: "cpIndexXp",
  data() {
    return {
      shuxing:"top-end",
      show: false,
      df: true,
      cepingHdglXpxxb: {},
      cepingHdglb: {},
      cepingHdglXpxxDfjlbList: [],
      cepingHdglCppmxbInfo: {},
      cepingXmmxbList: [],
      cepingGzmxbList: [],
      cepingCpgzBcpmxb: {},
      cepingCpgzCpmxb: {},
      cepingCpgzCpmxCppzb: {},
      cepingDjmxbList: [],
      cepingCpgzBcpmxbUser: {},
      cepingCpgzBcpmxbDept: {},
      cepingXmmxbObj: {},
      fzbList: [],
      zbCj: 2,//指标层级
      tableColumn: [{isTj:1}],
      tableHeader: [],
      tableData: [],//指标结构
      cepingDjmxb: {},
      ksdialogVisible: false,
      bgdialogVisible: false,
      bgUrl: "",
      recommendNumRead:0,
      colShowAll:[],
      cepingHdglXpxxbList:[],
      checkDisabled:false,
    }
  },
  methods: {
    initConfig(id) {
      this.show = false;
      this.df = true;

    },
    //选票（实名）
    initHd(hdId,cppId,userId) {
      this.show = false;
      this.df = true;
      this.cppId = cppId;
      this.hdId=hdId;
      let params ={
        cppId:cppId,
        hdId:hdId,
        userId:userId
      }
      xpInfoSm(params).then(res => {
        this.cepingHdglXpxxb = res.data.data.cepingHdglXpxxb;
        this.cepingHdglCppmxbInfo = res.data.data.cepingHdglCppmxbInfo;
        this.cepingHdglb = res.data.data.cepingHdglb;
        this.cepingXmmxbList = res.data.data.cepingXmmxbList;
        this.cepingGzmxbList = res.data.data.cepingGzmxbList;
        this.cepingCpgzBcpmxb = res.data.data.cepingCpgzBcpmxb;
        this.cepingCpgzCpmxb = res.data.data.cepingCpgzCpmxb;
        this.cepingCpgzCpmxCppzb = res.data.data.cepingCpgzCpmxCppzb;
        this.cepingDjmxbList = res.data.data.cepingDjmxbList;
        this.cepingCpgzBcpmxbUser = res.data.data.cepingCpgzBcpmxbUser;
        this.cepingCpgzBcpmxbDept = res.data.data.cepingCpgzBcpmxbDept;
        this.tableData = res.data.data.userList;
        this.tableData.forEach(item=>{
                if(item.rySr){
                  item.rySr = item.rySr.substring(0,7)
                }
              })
        // this.tableColumn = res.data.data.cepingHdglXpxxDfjlbList;
        this.recommendNumRead = res.data.data.cepingHdglXpxxDfjlbList.length;
        this.cepingHdglXpxxbList = res.data.data.cepingHdglXpxxbList;
        this.init();
      })
    },
    //选票（匿名）
    initXp(cppId,xpCode) {
      this.show = false;
      this.df = true;
      let params ={
        cppId:cppId,
        xpCode:xpCode
      }
      xpInfo(params).then(res => {
        this.cepingHdglXpxxb = res.data.data.cepingHdglXpxxb;
        this.cepingHdglCppmxbInfo = res.data.data.cepingHdglCppmxbInfo;
        this.cepingHdglb = res.data.data.cepingHdglb;
        this.cepingXmmxbList = res.data.data.cepingXmmxbList;
        this.cepingGzmxbList = res.data.data.cepingGzmxbList;
        this.cepingCpgzBcpmxb = res.data.data.cepingCpgzBcpmxb;
        this.cepingCpgzCpmxb = res.data.data.cepingCpgzCpmxb;
        this.cepingCpgzCpmxCppzb = res.data.data.cepingCpgzCpmxCppzb;
        this.cepingDjmxbList = res.data.data.cepingDjmxbList;
        this.cepingCpgzBcpmxbUser = res.data.data.cepingCpgzBcpmxbUser;
        this.cepingCpgzBcpmxbDept = res.data.data.cepingCpgzBcpmxbDept;
        this.tableData = res.data.data.userList;
        this.tableData.forEach(item=>{
                if(item.rySr){
                  item.rySr = item.rySr.substring(0,7)
                }
              })
        this.recommendNumRead = res.data.data.cepingHdglXpxxDfjlbList.length;
        this.cepingHdglXpxxbList = res.data.data.cepingHdglXpxxbList;
        this.init();
      })
    },
    init() {
      this.colShowAll = JSON.parse(this.cepingHdglCppmxbInfo.hostConfigJson);
      this.cepingXmmxbObj = {};
      this.zbCj = 1;
      var zbList = []

      function compareZb(a, b) {
        return a.zbPx - b.zbPx;
      }

      var zzList = [];
      // if (this.zbCj == 1) {
      //   zzList = zbList.sort(compareZb);
      // }
      // if (this.zbCj == 2) {
      //   var ls = [];
      //   for (var i in this.cepingXmmxbList) {
      //     if (this.cepingXmmxbList[i].pid == 0) {
      //       ls.push(this.cepingXmmxbList[i]);
      //     }
      //   }
      //   ls = ls.sort(compareZb);
      //   for (var j in ls) {
      //     var xls = []
      //     var qz = 0;
      //     for (var i in this.cepingXmmxbList) {
      //       if (this.cepingXmmxbList[i].pid == ls[j].id) {
      //         xls.push(this.cepingXmmxbList[i]);
      //         qz += this.cepingXmmxbList[i].zbQz;
      //       }
      //     }
      //     if (xls.length == 0) {
      //       ls[j].zbQz1 = ls[j].zbQz
      //       if (ls[j].zbQz > 0) {
      //         zzList.push(ls[j])
      //       }
      //     } else {
      //       var xxls = xls.sort(compareZb);
      //       for (var k in xxls) {
      //         xxls[k].zbQz1 = qz;
      //         if (xxls[k].zbQz > 0) {
      //           zzList.push(xxls[k])
      //         }
      //       }
      //     }
      //   }
      // }
      // if (this.zbCj == 3) {
      //   var ls = [];
      //   for (var i in this.cepingXmmxbList) {
      //     if (this.cepingXmmxbList[i].pid == 0) {
      //       ls.push(this.cepingXmmxbList[i]);
      //     }
      //   }
      //   ls = ls.sort(compareZb);
      //   for (var j in ls) {
      //     var xls = []
      //     var qz = 0;
      //     for (var i in this.cepingXmmxbList) {
      //       if (this.cepingXmmxbList[i].pid == ls[j].id) {
      //         xls.push(this.cepingXmmxbList[i]);
      //         qz += this.cepingXmmxbList[i].zbQz;
      //       }
      //     }
      //     if (xls.length == 0) {
      //       ls[j].zbQz1 = ls[j].zbQz
      //       if (ls[j].zbQz > 0) {
      //         zzList.push(ls[j])
      //       }
      //     } else {
      //       var xxls = xls.sort(compareZb);
      //       for (var k in xxls) {
      //         var xls1 = []
      //         var qz1 = 0;
      //         for (var ii in this.cepingXmmxbList) {
      //           if (this.cepingXmmxbList[ii].pid == xxls[k].id) {
      //             xls1.push(this.cepingXmmxbList[ii]);
      //             qz += this.cepingXmmxbList[ii].zbQz;
      //             qz1 += this.cepingXmmxbList[ii].zbQz;
      //           }
      //         }
      //         if (xls1.length == 0) {
      //           xxls[k].zbQz1 = xxls[k].zbQz
      //           if (xxls[k].zbQz > 0) {
      //             zzList.push(xxls[k])
      //           }
      //         } else {
      //           var xxls1 = xls1.sort(compareZb);
      //           for (var k1 in xxls1) {
      //             xxls1[k1].zbQz1 = qz1;
      //             if (xxls1[k1].zbQz > 0) {
      //               zzList.push(xxls1[k1])
      //             }
      //           }
      //         }
      //       }
      //     }
      //   }
      // }
      //补充已有打分
      // for (var i in zzList) {
      //   for (var j in this.cepingHdglXpxxDfjlbList) {
      //     if (this.cepingHdglXpxxDfjlbList[j].zbId == zzList[i].id) {
      //       zzList[i].fzId = this.cepingHdglXpxxDfjlbList[j].fzId;
      //       zzList[i].fzName = this.cepingHdglXpxxDfjlbList[j].fzName;
      //       zzList[i].fzFz = this.cepingHdglXpxxDfjlbList[j].fzFz;
      //       zzList[i].dfId = this.cepingHdglXpxxDfjlbList[j].id;
      //     }
      //   }
      // }

      this.fzbList = [];
      // for (var i in zzList) {
      //   if (this.fzbList.indexOf(zzList[i].zbName1) == -1) {
      //     this.fzbList.push(zzList[i].zbName1);
      //   }
      // }

      // this.tableData = zzList;
      // this.tableHeader = [];
      // for (var i in this.cepingGzmxbList) {
      //   if (this.cepingGzmxbList[i].fzSsz == "优秀") {
      //     this.tableHeader.push("优秀");
      //     break;
      //   }
      // }
      // for (var i in this.cepingGzmxbList) {
      //   if (this.cepingGzmxbList[i].fzSsz == "较好") {
      //     this.tableHeader.push("较好");
      //     break;
      //   }
      // }
      // for (var i in this.cepingGzmxbList) {
      //   if (this.cepingGzmxbList[i].fzSsz == "一般") {
      //     this.tableHeader.push("一般");
      //     break;
      //   }
      // }
      // for (var i in this.cepingGzmxbList) {
      //   if (this.cepingGzmxbList[i].fzSsz == "较差") {
      //     this.tableHeader.push("较差");
      //     break;
      //   }
      // }
      //
      // function compareGz(a, b) {
      //   return a.fzPx - b.fzPx;
      // }
      //
      // this.tableColumn = this.cepingGzmxbList.sort(compareGz);
      this.cepingDjmxb = {};
      // if (this.cepingHdglXpxxDfjlbList != null & this.cepingHdglXpxxDfjlbList.length > 0) {
      //   this.cepingHdglXpxxDfjlbList.forEach(r => {
      //     if (r.dfLx == 1) {
      //       this.cepingDjmxb = r;
      //     }
      //   })
      // }

      this.show = true;
    },
    objectSpanMethod({row, column, rowIndex, columnIndex}) {
      if (this.zbCj == 1) {
        return {
          rowspan: 1,
          colspan: 1
        };
      } else {
        if (columnIndex === 0) {
          if (rowIndex > 0 && this.tableData[rowIndex].userId == this.tableData[rowIndex - 1].userId) {
            return {
              rowspan: 0,
              colspan: 1
            }
          } else {
            var j = 0;
            for (var i = rowIndex; i < this.tableData.length; i++) {
              if (this.tableData[rowIndex].userId == this.tableData[i].userId) {
                j++;
              } else {
                break;
              }
            }
            return {
              rowspan: j,
              colspan: 1
            }
          }
        }
      }
    },
    cpDaFen(index, gz) {
      console.log(gz)
      //先判断已推荐人数是否大于可推荐人数
      if(this.cepingHdglCppmxbInfo.recommendNum < (this.recommendNumRead + 1)){
          this.$notify.closeAll();
          this.$notify.error({
            // title: '错误',
            message: "超过可推荐人数限制，不可再操作",
            showClose: true,
            duration: 5000
          })
          return;
      }

      // let info = {
      //   xpCode:  this.cepingHdglXpxxbList[index].xpCode,//this.cepingHdglXpxxb.xpCode,
      //   cxpCode:  this.cepingHdglXpxxbList[index].cxpCode,//this.cepingHdglXpxxb.cxpCode,
      //   voteId: this.cepingHdglXpxxbList[index].id,//this.cepingHdglXpxxb.id,
      //   itemId: 0,
      //   optId: this.tableData[index].userId,
      //   sheetType:4,
      //   voteOptId: gz.id,
      // }
      let info = {
        xpCode:  this.cepingHdglXpxxbList[index].xpCode,//this.cepingHdglXpxxb.xpCode,
        cxpCode:  this.cepingHdglXpxxbList[index].cxpCode,//this.cepingHdglXpxxb.cxpCode,
        voteId: this.cepingHdglXpxxbList[index].id,//this.cepingHdglXpxxb.id,
        itemId: 0,
        optId: this.tableData[index].userId,
        sheetType:4,
        //voteOptId: gz.id,
        itemType:0,
        userId:0,
        tjNum:this.cepingHdglCppmxbInfo.recommendNum
      }
      this.checkDisabled=true;
      daFenCp(info).then(res => {
        this.checkDisabled=false;
        if (res.data.code == "0") {
          // this.$set(this.tableData[index], "voteOptId", gz.id);
          // this.$set(this.tableData[index], "optId", gz.optId);
          // this.$set(this.tableData, index, this.tableData[index]);
          this.cepingHdglXpxxb = res.data.data.cepingHdglXpxxb;
          this.tableData = res.data.data.userList;
          this.tableData.forEach(item=>{
                if(item.rySr){
                  item.rySr = item.rySr.substring(0,7)
                }
              })
          // this.tableColumn = res.data.data.cepingHdglXpxxDfjlbList;
          //this.recommendNumRead = this.recommendNumRead + 1;//这种赋值赋值方式有问题,换成下面这种
          var recommendNumReadArr=this.tableData.filter(item=>item.wxOpenid==1);
          this.recommendNumRead=recommendNumReadArr.length;
        } else {
          this.$notify.closeAll();
          this.$notify.error(res.data.msg)
        }
      }).catch((err)=>{
        this.checkDisabled=false;
      })
      if(this.cepingHdglCppmxbInfo.recommendNum == this.recommendNumRead){
        this.$emit('get-mode','hz');
      }
    },
    delDaFen(index, gz){
      let info = {
        voteId: this.cepingHdglXpxxbList[index].id,//this.cepingHdglXpxxb.id,
        optId:this.tableData[index].userId,
        xpCode:  this.cepingHdglXpxxbList[index].xpCode,//this.cepingHdglXpxxb.xpCode,
      }
      this.checkDisabled=true;
      delDaFenCp(info).then(res => {
        this.checkDisabled=false;
        if (res.data.code == "0") {
          // this.tableColumn = res.data.data.cepingHdglXpxxDfjlbList;
          // if(this.tableColumn.length == 0){
          //   this.tableColumn.push({optId:1});
          // }
          // this.$set(this.tableData[index], "voteOptId", gz.id);
          // this.$set(this.tableData[index], "optId", gz.optId);
          // this.$set(this.tableData, index, this.tableData[index]);
          this.tableData = res.data.data.userList;
          this.tableData.forEach(item=>{
                if(item.rySr){
                  item.rySr = item.rySr.substring(0,7)
                }
              })
         // this.recommendNumRead = this.recommendNumRead - 1;//这种赋值赋值方式有问题,换成下面这种
          var recommendNumReadArr=this.tableData.filter(item=>item.wxOpenid==1);
          this.recommendNumRead=recommendNumReadArr.length;
        } else {
          this.$notify.closeAll();
          this.$notify.error(res.data.msg)
        }
      }).catch((err)=>{
        this.checkDisabled=false;
      })
    },
    djDaFen(dj) {
      this.cepingHdglXpxxDfjlbList.forEach(r => {
        if (r.dfLx == 1) {
          let info = {
            xpCode: this.cepingHdglXpxxb.xpCode,
            cxpCode: this.cepingHdglXpxxb.cxpCode,
            xpId: this.cepingHdglXpxxb.id,
            dfId: r.id,
            dcId: dj.id,
            dcName: dj.dcName,
            dcFz: dj.dcFz
          }
          daFenDj(info).then(res => {
            if (res.data.code == "0") {
              this.cepingDjmxb = res.data.data.cepingHdglXpxxDfjlb;
              this.cepingHdglXpxxb = res.data.data.cepingHdglXpxxb;
            } else {
              this.$notify.closeAll();
              this.$notify.error(res.data.msg)
            }
          })
        }
      })
    },
    getClass(i, len) {
      let x = i + 1;
      if (x / len <= 0.25) {
        return "pjyx";
      } else if (x / len <= 0.5) {
        return "pjjh";
      } else if (x / len <= 0.75) {
        return "pjyb";
      } else {
        return "pjjc";
      }
    },
    viewGz() {
      this.ksdialogVisible = true;
    },
    viewBg(obj) {
      var p = {}
      if (obj.bcpDx == '部门') {
        p.bcpDeptId = obj.bcpDeptId
      } else {
        p.bcpUserId = obj.bcpUserId
      }
      p.hdId = obj.hdId;
      p.cppId = obj.cppId;
      queryBcpUserSzbg(p).then(res => {
        var szbg = res.data.data;
        if (szbg) {
          if (szbg.szbgFjdz) {
            this.bgUrl = getPreview(szbg.szbgFjdz) + "&officePreviewType=pdf";
            this.bgdialogVisible = true;
          } else {
            this.$notify.closeAll();
            this.$notify.error('还没有述职报告');
          }
        } else {
          this.$notify.closeAll();
          this.$notify.error('还没有述职报告');
        }
      });
    },
    yzDf() {
      let cpx = 0;
     // cpx = this.cepingHdglCppmxbInfo.recommendNum - this.recommendNumRead;
      if(this.recommendNumRead==0){
        cpx=1;
      }
      // for (var i in this.tableData) {
      //   if (!this.tableData[i].fzId) {
      //     return 1;
      //   }
      // }
      // if (this.cepingDjmxbList != null && this.cepingDjmxbList.length > 0) {
      //   if (!this.cepingDjmxb.dcId) {
      //     return 2;
      //   }
      // }
      return cpx;
    },
    //获取脚标说明
    getFooterText(){
      return this.cepingHdglCppmxbInfo.footerText;
    },
    tableRowClassName({row, rowIndex}) {
      let fz = this.fzbList.indexOf(this.tableData[rowIndex].zbName1);
      let className = '';
      if (fz % 2 == 0) {
        className = 'cpRowNormal';
      } else {
        className = 'cpRowstripe';
      }
      return className;
    }
  }
}
</script>

<style scoped>
.h_dw_time{
  text-align: left;
}
</style>

